<#include "/templates/taglibs.ftl" />
<#include "/templates/function.ftl" />
<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="${contextPath}/assets/css/amap.css" />
        <style>
            .layui-card-body{
                height: 300px;
            }
        </style>
    </head>
    <body>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div id="container"></div>
                    <div class="info" id="text">请用鼠标在地图上操作试试</div>
                    <div class="input-card">
                        <div class="input-item">
                          <input type="radio" name='func' value='marker'><span class="input-text">画点</span>
                          <input type="radio" name='func' value='polyline'><span class="input-text">画折线</span>
                          <input type="radio" name='func' value='polygon'><span class="input-text" style='width:5rem;'>画多边形</span>
                          <input type="radio" name='func' value='rectangle'><span class="input-text">画矩形</span>
                          <input type="radio" name='func' value='circle'><span class="input-text">画圆</span>
                        </div>
                        <div class="input-item">
                            <input id="clear" type="button" class="btn" value="清除" />
                            <input id="save" type="button" class="btn" value="保存" />
                            <input id="close" type="button" class="btn" value="关闭" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <script type="text/javascript" src="${contextPath}/assets/js/jquery.min.js"></script>
    <script type="text/javascript" src="https://webapi.amap.com/loader.js"></script>
    <script type="text/javascript" src="${contextPath}/assets/js/amap.js"></script>
    <script>
        $(function(){
            $(window).on('resize',function(){
                var h = $(window).height();
                var w = $(window).width() - 15;
                $('#container').css({height:h+"px",width:w+"px"});
            }).resize();
        })
    </script>
</html>